<template>
  <div class="drawerReflect">
    <el-drawer :visible="drawerReflectBoolen"
               title="体现审核"
               size="40%"
               @open="openFn"
               :before-close="handleClose"
               ref="drawer">
      <!-- 评论列表 -->

      <div class="reflectList">

        <img class="avaterImg"
             src="https://s3-alpha-sig.figma.com/img/1471/90a6/0457d3657f87681ab50c3baff91fd8c5?Expires=1695600000&Signature=mZky81rkR6IlZXLgRcND74o~r3jie7hchlKCSpBGlnH3DL8EMz9Jq8yi9ZCjIonl3FLzX-dzlJKveayoU6FFcpJQQghyS2LUc3KGVZApmDG3VF4Ot2lg2JIBY5xShbRIrt21mphQe~DCxmDdOMkt1q5CXwpyaxLL~0NS1ITURcqr1owEBwxD8ig9aOfuKhMqQpy2Y-jClZBLuaw~pZYFf2ILPCMokTi7q9J-S3rZmXzDaabQtPRujuTfBtoDQOU09o9b-ytuGBmySD97xZRy3SnBUE9e7-ZNlOCXpxl~83TmvcOGLAR8yxbUcHfZRDZT059N7qvN8tNyfmTiZlpg-Q__&Key-Pair-Id=APKAQ4GOSFWCVNEHN3O4"
             alt="">
        <div class="commentInfo flex-columns-center">
          <div class="nickName">
            <span style="color: #000;font-weight: 400;">月亮姐姐</span>

          </div>
          <div class="rate">
            <el-tag type="success"
                    size="small">体现中</el-tag>
          </div>

        </div>

      </div>
      <!-- 体现展示信息 -->
      <div class="padding20">
        <div class="flex-start">

          <div class="display">
            <div class="reflectListLeft">
              <div>提现金额</div>
              <div>申请时间</div>
              <div>订单编号</div>
              <div>体现状态</div>
            </div>
            <div class="flex-column-between reflectListRight">
              <div>￥9800</div>
              <div>2023-10-12 16:00</div>
              <div>10000000000100110011010</div>
              <div>
                <el-radio v-model="radio"
                          label="1">同意</el-radio>
                <el-radio v-model="radio"
                          label="2">驳回</el-radio>
              </div>
            </div>
          </div>
          <div class="display ">
            <div class="reflectListLeft">
              <div>到账金额</div>
              <div>手续费</div>
              <div>体现方式</div>

            </div>
            <div class="flex-column-between reflectListRight">
              <div>￥9800</div>
              <div>￥9800</div>
              <div> 微信体现</div>

            </div>
          </div>
        </div>
        <!-- 佣金来源 -->
        <commissionSource></commissionSource>
      </div>
    </el-drawer>
  </div>
</template>
  <script>
import commissionSource from './commissionSource.vue'
export default {
  name: 'drawerReflect',
  props: {
    drawerReflectBoolen: {
      type: Boolean,
      default: false
    }
  },
  components: {
    // 佣金来源
    commissionSource
  },

  data () {
    return {


    };
  },
  methods: {


    // 关闭抽屉
    handleClose () {
      console.log('评论')
      this.$emit('update:drawerReflectBoolen', false);
    }
  }
};

  </script>
  <style lang="less">
.drawerReflect {
  .reflectList {
    display: flex;
    padding: 14px 0;
    border-bottom: 1px solid #d9d9d9;
    margin: 0 20px;
    .avaterImg {
      width: 46px;
      height: 46px;
      border-radius: 46px;
      margin-right: 10px;
    }
    .commentInfo {
      width: 100%;
    }
  }
  .padding20 {
    padding: 20px;
    .reflectListLeft {
      padding: 0px 0 20px 0px;
      div {
        margin-bottom: 22px;
      }
    }
    .reflectListRight {
      padding: 0px 0 20px 20px;
      margin-bottom: 22px;
      margin-right: 50px;
    }
  }
}
</style>